import React, { Component } from 'react'
import { Tabs, List, Button, Table, Divider, Modal, Form, Input, Icon, Popover, InputNumber, Switch, notification, Select, Cascader, Drawer, Row, Col, Popconfirm, Upload, message, Menu, DatePicker, Radio, Tree, Card, Tag, Tooltip, } from 'antd';
import * as APIService from '../../../axios/api_yq';
import { openModalMessage, openSuccessModal } from '../../../components/TableCustomize';
import '../../../assets/css/settings.scss';
import '../../../assets/css/location.css'
import { baseUrl, toLead } from '../../../config';
import { withPermission } from '../../../components/withpermission'
const CreateButton = withPermission(Button, 'plus')//新增
const DownLoadButton = withPermission(Button, 'download')//导出模板
const UploadButton = withPermission(Button, 'upload')//导入

const { TabPane } = Tabs;
const { Option } = Select;
const { confirm } = Modal;
const FormItem = Form.Item;
const { SubMenu } = Menu;
const { TreeNode } = Tree;


// 上传物料图片
function getBase64(img, callback) {
    const reader = new FileReader();
    reader.addEventListener('load', () => callback(reader.result));
    reader.readAsDataURL(img);
}

function beforeUpload(file) {
    const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
    if (!isJpgOrPng) {
        message.error('You can only upload JPG/PNG file!');
    }
    const isLt2M = file.size / 1024 / 1024 < 2;
    if (!isLt2M) {
        message.error('Image must smaller than 2MB!');
    }
    return isJpgOrPng && isLt2M;
}
function callback(key) {
    // console.log(key);
}
//弹出通知提醒框
// function openNotification(type, message) {
// 	notification.open({
// 		type: type,
// 		message: message,
// 		duration: 2,
// 	});
// };

class App extends Component {
    state = {
        loading: false, //加载中...
        dataSource: [],
        dataSourceExtend: [],
        dataSourceEquipmentType: [],
        visible: false, //显示与隐藏----增加集团
        visibleExtend: false, //显示与隐藏----扩展框
        visibleChild: false, //显示与隐藏----增加工厂
        visibleChildWorkShop: false,
        visibleChildProductionLine: false,
        visibleMachine: false, //添加设备
        visibleMoreGroup: false, //显示与隐藏----更多详情
        visibleMoreFactory: false,
        visibleMoreWorkShop: false,
        visibleMoreProductionLine: false,
        visibleMoreStation: false,
        visibleChildStation: false,
        modalData: '',//选中的数据
        handleType: 0,//新增0 修改1
        topId: 0,
        pagination: {
            pageSize: 10,
            current: 1
        },
        loading: false,
        chooseData: '',
        visible_user: false,
        visible_role: false,
        roleData: [],
        options: [],
        roleList: [],
        fileList: [],
        uploading: false,
        fileTypeList: [],
        fileTagList: [],
        treeData: [],
        activeKey: '',
        tags: [],
        rowSelection: '',
        rowSelectKeys: '',
        rowArr: [],
        formTitle: [
            {
                code: '集团编码',
                name: '集团名称',
                centerTitle: '下级信息工厂'
            },
            {
                code: '工厂编码',
                name: '工厂名称',
                centerTitle: '下级信息车间'
            },
            {
                code: '车间编码',
                name: '车间名称',
                centerTitle: '下级工作中心'
            },
            {
                code: '工作中心编码',
                name: '工作中心名称',
                centerTitle: '下级信息工位'
            },
            {
                code: '工位编码',
                name: '工位名称',
                centerTitle: '下级信息设备'
            },
        ],
        type: 10,
        list: [],
        listCard: [],
        listCardEquipment: [],
        buttonList: []
    };

    //初始化加载数据
    fetch = () => {
        const buttonList = JSON.parse(localStorage.getItem('buttonList'))
        console.log('这是按钮', buttonList);
        if (buttonList ? buttonList.length !== 0 : null) {
            this.setState({
                buttonList
            })
        }
        this.setState({ loading: true })
        setTimeout(() => {
            APIService.queryLocation().then(data => {
                if (data.data.code === 200) {
                    this.setState({
                        treeData: data.data.data,
                        loading: false,
                    })
                } else {
                    openModalMessage('error', data.data.msg)
                }

            })
        }, 300);

    }
    componentDidMount() {
        this.fetch();
        this.setState({
            rowSelection: {
                onSelect: (record, selected, selectedRows, nativeEvent) => {
                    console.log(record)
                    let arr = this.state.rowArr
                    if (selected) {
                        arr.push(record.id)
                    } else {
                        arr = arr.filter((v, i, item) => {
                            return record.id != v;
                        });
                    }
                    this.setState({
                        rowArr: arr
                    })
                    this.state.rowSelection.selectedRowKeys = arr;
                },
                onChange: (selectedRowKeys, selectedRows) => {
                    this.setState({ tags: selectedRows })
                },
                onSelectAll: (selected, selectedRows, changeRows) => {
                    let arr = this.state.rowArr;
                    if (selected) {
                        for (let index = 0; index < selectedRows.length; index++) {
                            console.log(selectedRows[index])
                            arr.push(selectedRows[index].id);
                        }
                        this.state.rowSelection.selectedRowKeys = arr;
                        this.setState({ tags: selectedRows })
                    } else {
                        arr = [];
                        this.state.rowSelection.selectedRowKeys = [];
                        this.setState({ tags: [] })
                    }
                    this.setState({ rowArr: arr })
                },
                selectedRowKeys: []
            }
        })
    }
    componentWillUnmount() {
        this.setState = () => {
            return;
        };
    }
    renderTreeNodes = data =>
        data.map(item => {
            if (item.children) {
                return (
                    <TreeNode title={item.name} key={item.id} selectable={item.type === 60 ? false : true} dataRef={item}>
                        {this.renderTreeNodes(item.children)}
                    </TreeNode>
                );
            }
            return <TreeNode key={item.id} title={item.name} dataRef={item} />;


        });

    // 触发树节点时调用函数
    onSelectTree = (key, e) => {
        console.log(key, e)
        const treeNode = e.selectedNodes[0]
        if (e.selected) {
            // const rightTopTitle = document.querySelector(".rightTopTitle div>strong");
            // rightTopTitle.innerHTML = e.selectedNodes[0].props.title
            // if(treeNode.props.dataRef.type===10){
            this.setState({
                type: treeNode.props.dataRef.type,
                list: treeNode.props.dataRef,
                listCard: treeNode.props.dataRef.children ? treeNode.props.dataRef.children : [],
            })
            this.props.form.setFieldsValue({
                groupName: treeNode.props.dataRef.name,
                groupCode: treeNode.props.dataRef.code,
                factoryName: treeNode.props.dataRef.name,
                factoryCode: treeNode.props.dataRef.code,
                workshopName: treeNode.props.dataRef.name,
                workshopCode: treeNode.props.dataRef.code,
                productionLineName: treeNode.props.dataRef.name,
                productionLineCode: treeNode.props.dataRef.code,
                stationName: treeNode.props.dataRef.name,
                stationCode: treeNode.props.dataRef.code,
            })
        }
        // console.log(this.state.list)
    }
    // 下载文件
    downloadFile = (data) => {
        const that = this;
        // window.open('http://192.168.0.110:9050/file/downloadFile/' + data.fileId)
        // APIService.downloadFiles(data.fileId).then(data => {
        // 	console.log(data.data.data)
        // 	openNotification('success', '下载成功');
        // 	// that.fetch('');
        // })
    }
    // 加载文件
    showFileDetails = (data) => {
        const that = this;
        // APIService.showFiles(data.fileId).then(data => {
        // 	openNotification('success', '加载成功');
        // 	// that.fetch('');
        // })
    }
    //弹出删除框
    showDeleteConfirm = (data) => {
        const that = this;
        confirm({
            title: '确认删除' + '[' + data.name + ']？',
            okText: '确认',
            okType: 'danger',
            cancelText: '取消',
            onOk() {
                APIService.deleteTeamID(data.id).then(data => {
                    console.log(data);
                    if (data.data.code === 200) {
                        openSuccessModal('删除成功')
                        const type = that.state.type + 10
                        APIService.workshopAndLine('pId=' + that.state.list.id + '&type=' + type).then(data => {
                            console.log('这是', data.data)
                            that.setState({ listCard: data.data })
                        })
                        that.fetch();
                    } else {
                        openModalMessage('error', data.data.msg)
                    }

                }).catch(function (error) {
                    console.log(error);
                    openModalMessage('error', '未选中')
                });
            },
            onCancel() {
                console.log('Cancel error');
            },
        });
    }
    onExpand = (record, index, indent, expanded) => {

    }
    handleCancel = e => {
        this.props.form.resetFields();//清除form表单控件的值
        this.setState({
            visible: false,
        });
    };
    // 上传物料图片 
    handleChange = info => {
        if (info.file.status === 'uploading') {
            this.setState({ loading: true });
            return;
        }
        if (info.file.status === 'done') {
            // Get this url from response in real world.
            getBase64(info.file.originFileObj, imageUrl =>
                this.setState({
                    imageUrl,
                    loading: false,
                }),
            );
        }
    };


    // 左侧菜单menu

    handleNumberChange = key => { }
    handleCurrencyChange = key => { }

    handleSearch = (e) => {
        this.setState({ loading: true })
        this.props.form.validateFields(['equipmentCodeSearch', 'equipmentNameSearch'], (err, values) => {
            let str = '?cs=1';
            if (values.equipmentCodeSearch) {
                str += '&equipmentCode=' + values.equipmentCodeSearch;
            }
            if (values.equipmentNameSearch) {
                str += '&equipmentName=' + values.equipmentNameSearch;
            }
            // console.log(str)
            // this.fetch(str);
            // APIService.queryEquipmentList(str).then(data => {
            // 	if (data.data.code === 200) {
            // 		const dataSourse = data.data.data
            // 		this.setState({
            // 			// visibleMachine: true,
            // 			loading: false,
            // 			dataSourceEquipmentType: dataSourse
            // 		});
            // 	} else {
            // 		openNotification('warning', data.data.msg)
            // 	}
            // }).catch(err => {
            // 	console.log(err)
            // })

        });
    };
    // 打开新增面板
    showDrawer = () => {
        this.setState({
            visible: true,
        });
    };
    showDrawerChild = () => {
        this.setState({
            visibleChild: true,
        });
    };
    showDrawerChildProductionLine = () => {
        this.setState({
            visibleChildProductionLine: true,
        });
    };
    showDrawerChildStation = () => {
        this.setState({
            visibleChildStation: true,
        });
    };
    showDrawerChildWorkShop = () => {
        this.setState({
            visibleChildWorkShop: true,
        });
    };


    showDrawerMachine = () => {
        this.setState({ loading: true })
        openModalMessage('error', '已经是最后一级了')
        // APIService.queryEquipmentList('').then(data => {
        //     if (data.data.code === 200) {
        //         const dataSourse = data.data.data
        //         this.setState({
        //             visibleMachine: true,
        //             dataSourceEquipmentType: dataSourse,
        //             loading: false
        //         });
        //     } else {
        //         openNotification('warning', data.data.msg)
        //     }
        // }).catch(err => {
        //     console.log(err)
        // })

    };


    showModalExtend = () => {
        this.setState({
            visibleExtend: true,
        });
    };
    showMoreGroup = (data, type) => {
        const that = this;
        this.props.form.setFieldsValue({
            // 'materialCode','eigenvalue','materialName','uomName','materialType','materialGroup'
            // groupCode: data.groupCode,
            // groupName: data.groupName,
            // 需要动态的数据
            groupCodeMore: that.state.list.code,
            groupNameMore: that.state.list.name
        })
        this.setState({
            visibleMoreGroup: true,
            modalData: data,
            handleType: type,
        });

    };
    showMoreFactory = (data, type) => {
        const that = this;
        this.props.form.setFieldsValue({
            // 'materialCode','eigenvalue','materialName','uomName','materialType','materialGroup'
            // groupCode: data.groupCode,
            // groupName: data.groupName,
            factoryCodeMore: that.state.list.code,
            factoryNameMore: that.state.list.name
        })

        this.setState({
            visibleMoreFactory: true,
            modalData: data,
            handleType: type,
        });

    };
    showMoreWorkShop = (data, type) => {
        const that = this;
        console.log(data)
        this.props.form.setFieldsValue({
            workshopCodeMore: that.state.list.code,
            workshopNameMore: that.state.list.name
        })

        this.setState({
            visibleMoreWorkShop: true,
            modalData: data,
            handleType: type,
        });

    };
    showMoreProductionLine = (data, type) => {
        const that = this;
        console.log(data)
        this.props.form.setFieldsValue({
            produtionLineCodeMore: that.state.list.code,
            produtionLineNameMore: that.state.list.name
        })
        this.setState({
            visibleMoreProductionLine: true,
            modalData: data,
            handleType: type,
        });

    };
    showMoreStation = (data, type) => {
        const that = this;
        console.log(data)
        this.props.form.setFieldsValue({
            stationCodeMore: that.state.list.code,
            stationNameMore: that.state.list.name
        })
        this.setState({
            visibleMoreStation: true,
            modalData: data,
            handleType: type,
        });

    };
    onClose = () => {
        this.props.form.resetFields(['addGroupName', 'addGroupCode', 'groupAdress', 'childGroupName']);
        this.setState({
            visible: false,
        });
    };
    onCloseChange = () => {
        this.props.form.resetFields(['groupNameMore', 'groupCodeMore', 'groupAdressMore', 'childGroupNameMore']);
        this.setState({
            visibleMoreGroup: false,
        });
    };
    onCloseChangeWorkShop = () => {
        this.props.form.resetFields(['workshopCodeMore', 'workshopNameMore']);
        this.setState({
            visibleMoreWorkShop: false,
        });
    };
    onCloseChangeFactory = () => {
        this.props.form.resetFields(['workshopCodeMore', 'workshopNameMore']);
        this.setState({
            visibleMoreFactory: false,
        });
    };
    onCloseChangeProductionLine = () => {
        this.props.form.resetFields(['workshopCodeMore', 'workshopNameMore']);
        this.setState({
            visibleMoreProductionLine: false,
        });
    };
    onCloseChangeStation = () => {
        this.props.form.resetFields(['stationCodeMore', 'stationNameMore']);
        this.setState({
            visibleMoreStation: false,
        });
    };
    onCloseExtend = () => {
        this.props.form.resetFields();
        this.setState({
            visibleExtend: false,
        });
    };
    onCloseChild = () => {
        this.props.form.resetFields(['factoryCodeAdd', 'factoryNameAdd']);
        this.setState({
            visibleChild: false,
        });
    };
    onCloseChildProductionLine = () => {
        this.props.form.resetFields(['productionLineNameAdd', 'productionLineCodeAdd']);
        this.setState({
            visibleChildProductionLine: false,
        });
    };
    onCloseChildStation = () => {
        this.props.form.resetFields(['stationNameAdd', 'stationCodeAdd']);
        this.setState({
            visibleChildStation: false,
        });
    };
    onCloseChildWorkShop = () => {
        this.props.form.resetFields(['workshopCodeAdd', 'workshopNameAdd']);
        this.setState({
            visibleChildWorkShop: false,
        });
    };
    onCloseMachine = () => {
        this.props.form.resetFields(['equipmentCodeAdd', 'equipmentNameAdd', 'equipmentTypeNameSearch', 'equipmentNameSearch', 'equipmentCodeSearch']);
        this.setState({
            visibleMachine: false,
        });
    };
    // 新增
    onOk = () => {
        const { form: { validateFields } } = this.props; //引入validateFields方法
        // ['addGroupName','addGroupCode','groupAdress','childGroupName']
        validateFields(['addGroupName', 'addGroupCode', 'groupAdress', 'childGroupName'], (err, values) => {
            //  data.groupCode = values.groupAdress
            //  data.groupCode = values.childGroupName
            if (!err) {
                const data = {}
                data.code = values.addGroupCode
                data.name = values.addGroupName
                data.type = 10
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        const type = this.state.type + 10
                        APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                            // console.log(data.data)
                            this.setState({ listCard: data.data })
                        })
                        this.onClose()
                        this.fetch()
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
                // this.setState({
                // 	visible: false,
                // });
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };

    // 修改
    onOkChange = () => {
        // 'groupCodeMore','groupNameMore','groupAdressMore','childGroupNameMore'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['groupCodeMore', 'groupNameMore', 'groupAdressMore', 'childGroupNameMore'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.groupCodeMore
                data.name = values.groupNameMore
                data.id = this.state.list.id
                console.log('传入修改数据', data);
                APIService.addTeam1(data).then(res => {
                    console.log('这是修改后', res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        this.onCloseChange()
                        this.fetch()
                        this.props.form.setFieldsValue({
                            groupName: values.groupNameMore,
                        })
                        let list = { code: values.groupCodeMore, name: values.groupNameMore, id: this.state.list.id }
                        this.setState({
                            list: list
                        })
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChangeWorkShop = () => {
        // 'workshopCodeMore', 'workshopNameMore'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['workshopCodeMore', 'workshopNameMore'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.workshopCodeMore
                data.name = values.workshopNameMore
                data.id = this.state.list.id
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        this.onCloseChangeWorkShop()
                        this.fetch()
                        this.props.form.setFieldsValue({
                            workshopName: values.workshopNameMore,
                        })
                        let list = { code: values.workshopCodeMore, name: values.workshopNameMore, id: this.state.list.id }
                        this.setState({
                            list: list
                        })
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChangeFactory = () => {
        // 'factoryCodeMore','factoryNameMore'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['factoryCodeMore', 'factoryNameMore'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.factoryCodeMore
                data.name = values.factoryNameMore
                data.id = this.state.list.id
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        this.onCloseChangeFactory()
                        this.fetch()
                        this.props.form.setFieldsValue({
                            factoryName: values.factoryNameMore,
                        })
                        let list = { code: values.factoryCodeMore, name: values.factoryNameMore, id: this.state.list.id }
                        this.setState({
                            list: list
                        })
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChangeProductionLine = () => {
        // 'produtionLineCodeMore','produtionLineNameMore'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['produtionLineCodeMore', 'produtionLineNameMore'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.produtionLineCodeMore
                data.name = values.produtionLineNameMore
                data.id = this.state.list.id
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        this.onCloseChangeProductionLine()
                        this.fetch()
                        this.props.form.setFieldsValue({
                            productionLineName: values.produtionLineNameMore,
                        })
                        let list = { code: values.produtionLineCodeMore, name: values.produtionLineNameMore, id: this.state.list.id }
                        this.setState({
                            list: list
                        })
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChangeStation = () => {
        // 'produtionLineCodeMore','produtionLineNameMore'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['stationCodeMore', 'stationNameMore'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.stationCodeMore
                data.name = values.stationNameMore
                data.id = this.state.list.id
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        this.onCloseChangeStation()
                        this.fetch()
                        this.props.form.setFieldsValue({
                            stationName: values.stationNameMore,
                        })
                        let list = { code: values.stationCodeMore, name: values.stationNameMore, id: this.state.list.id }
                        this.setState({
                            list: list
                        })
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };


    onOkExtend = () => {
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['Code', 'NameCN', 'NameEN', 'Type'], (err, values) => {
            if (!err) {
                // this.setState({
                // 	visibleExtend: false,
                // });
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    // 新增
    onOkChild = () => {
        // 'factoryCodeAdd','factoryNameAdd'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['factoryCodeAdd', 'factoryNameAdd'], (err, values) => {
            if (!err) {
                // console.log(this.state.list)
                const data = {}
                data.code = values.factoryCodeAdd
                data.name = values.factoryNameAdd
                data.pid = this.state.list.id
                data.type = this.state.type + 10
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        const type = this.state.type + 10
                        APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                            // console.log(data.data)
                            this.setState({ listCard: data.data })
                        })
                        this.onCloseChild()
                        this.fetch()
                        // this.setState({
                        // 	visibleChild: false,
                        // });
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChildProductionLine = () => {
        // 'productionLineCodeAdd', 'productionLineNameAdd'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['productionLineCodeAdd', 'productionLineNameAdd'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.productionLineCodeAdd
                data.name = values.productionLineNameAdd
                data.pid = this.state.list.id
                data.type = this.state.type + 10
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        const type = this.state.type + 10
                        APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                            // console.log(data.data)
                            this.setState({ listCard: data.data })
                        })
                        this.onCloseChildProductionLine()
                        this.fetch()
                        // this.setState({
                        // 	visibleChildProductionLine: false,
                        // });
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChildStation = () => {
        // 'productionLineCodeAdd', 'productionLineNameAdd'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['stationCodeAdd', 'stationNameAdd'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.stationCodeAdd
                data.name = values.stationNameAdd
                data.pid = this.state.list.id
                data.type = this.state.type + 10
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        const type = this.state.type + 10
                        APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                            // console.log(data.data)
                            this.setState({ listCard: data.data })
                        })
                        this.onCloseChildStation()
                        this.fetch()
                        // this.setState({
                        // 	visibleChildStation: false,
                        // });
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkChildWorkShop = () => {
        // 'workshopCodeAdd','workshopNameAdd' 
        const { form: { validateFields } } = this.props; //引入validateFields方法
        validateFields(['workshopCodeAdd', 'workshopNameAdd'], (err, values) => {
            if (!err) {
                const data = {}
                data.code = values.workshopCodeAdd
                data.name = values.workshopNameAdd
                data.pid = this.state.list.id
                data.type = this.state.type + 10
                APIService.addTeam1(data).then(res => {
                    console.log(res)
                    if (res.data.code === 200) {
                        openSuccessModal(res.data.msg)
                        const type = this.state.type + 10
                        APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                            // console.log(data.data)
                            this.setState({ listCard: data.data })
                        })
                        this.onCloseChildWorkShop()
                        this.fetch()
                        // this.setState({
                        // 	visibleChildWorkShop: false,
                        // });
                    } else {
                        openModalMessage('warning', res.data.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
            if (err) return;
            //  this.handleAdd(values);  //若无error则继续进行表单提交
        });
    };
    onOkMachine = () => {
        // 'equipmentCodeAdd','equipmentNameAdd''equipmentCodeSearch''equipmentNameSearch''equipmentTypeNameSearch'
        const { form: { validateFields } } = this.props; //引入validateFields方法
        const key = this.state.activeKey
        const dataList = this.state.tags
        var equipmentLlist = []
        for (var item of dataList) {
            var data = {}
            data.code = item.equipmentCode
            data.name = item.equipmentName
            equipmentLlist.push(data)
        }
        let datas = {}
        datas.pid = this.state.list.id
        datas.type = this.state.type + 10
        datas.equipmentLlist = equipmentLlist
        APIService.addTeam1(datas).then(res => {
            console.log(res)
            if (res.data.code === 200) {
                openSuccessModal(res.data.msg)
                const type = this.state.type + 10
                APIService.workshopAndLine('pId=' + this.state.list.id + '&type=' + type).then(data => {
                    // console.log(data.data)
                    this.setState({ listCard: data.data })
                })
                this.onCloseMachine()
                this.fetch()
                // this.setState({
                // 	visibleMoreGroup: false,
                // });
            } else {
                openModalMessage('warning', res.data.msg)
            }
        }).catch(err => {
            console.log(err)
        })
    };
    onChange = activeKey => {
        this.setState({ activeKey });
    };
    // 动态生成标签
    handleClose = (removedTag) => {
        const tags = this.state.tags.filter(tag => tag !== removedTag);
        var data = [];
        for (var value of tags) {
            data.push(value.id);
        }
        this.setState({
            rowSelectKeys: data
        })
        setTimeout(() => {
            this.setState({
                tags: tags,
                rowArr: this.state.rowSelectKeys,
                rowSelection: {
                    onSelect: (record, selected, selectedRows, nativeEvent) => {
                        let arr = this.state.rowArr
                        if (selected) {
                            arr.push(record.id)
                        } else {
                            arr = arr.filter((v, i, item) => {
                                return record.id != v;
                            });
                        }
                        this.setState({
                            rowArr: arr
                        })
                        this.state.rowSelection.selectedRowKeys = arr;
                    },
                    onChange: (selectedRowKeys, selectedRows) => {
                        this.setState({ tags: selectedRows, rowSelectKeys: selectedRowKeys })

                    },
                    onSelectAll: (selected, selectedRows, changeRows) => {
                        let arr = this.state.rowArr;
                        if (selected) {
                            for (let index = 0; index < selectedRows.length; index++) {
                                arr.push(selectedRows[index].id);
                            }
                            this.state.rowSelection.selectedRowKeys = arr;
                            this.setState({ tags: selectedRows })
                        } else {
                            arr = [];
                            this.state.rowSelection.selectedRowKeys = [];
                            this.setState({ tags: [] })
                        }
                        this.setState({ rowArr: arr })
                    },
                    selectedRowKeys: this.state.rowSelectKeys
                }

            });

        }, 200)


    };

    // 导出模板
    derive = () => {
        APIService.exportExcelDemo321().then(res => {
            //设置下载文件类型为xlsx 不同的类型type也不一样，创建URL对象
            let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
            // 创建A标签
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            // 设置的下载文件文件名
            const fileName = decodeURI('工厂建模');
            // 触发点击方法
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
        })
    }

    // 按钮点击事件
    // btnClick = (a) => {
    //     if (a === 0) {
    //         this.showDrawerChild([], 0)
    //     }
    //     if (a === 1) {
    //         this.derive()
    //     }
    // }
    render() {
        const then = this
        const { size, value } = this.props
        const { buttonList, uploading, fileList } = this.state;
        const { tags, inputVisible, inputValue } = this.state;
        // 上传物料图片
        // const UploadButton = (
        //     <div>
        //         <Icon type={this.state.loading ? 'loading' : 'plus'} />
        //         <div className="ant-upload-text">上传</div>
        //     </div>
        // );
        const { imageUrl } = this.state;
        const columnsExtend = [
            {
                title: '编码',
                dataIndex: 'Code',
            },
            {
                title: '类型',
                dataIndex: 'Type',
            },
            {
                title: '名称(中文)',
                dataIndex: 'NameCN'
            },
            {
                title: '名称(英文)',
                dataIndex: 'NameEN'
            },
            {
                title: '操作',
                width: '12%',
                render: (text, record) => {
                    return <span>
                        <a onClick={() => this.showDeleteConfirm(record)}>
                            删除
                        </a>
                    </span>
                }
            }
        ];
        const columnsEquipmentType = [
            {
                title: '设备编码',
                dataIndex: 'equipmentCode',
            },
            {
                title: '设备名称',
                dataIndex: 'equipmentName'
            },
            // {
            // 	title: '设备类型',
            // 	dataIndex: 'equipmentTypeName',
            // },
        ];
        // 复选框(table设备选择)
        // const rowSelection = {
        // 	onChange: (selectedRowKeys, selectedRows) => {
        // 		console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
        // 		this.setState({tags:selectedRows})
        // 	}
        // };

        const { getFieldDecorator } = this.props.form;
        var keys = [];
        var Tags = (props) => {
            const { tags } = this.state
            return tags.map((tag, index) => {
                keys.push(tag.id)
                const isLongTag = tag.equipmentName.length > 20;
                const tagElem = (
                    <Tag color="#108ee9" key={tag.id} closable={true} onClose={() => this.handleClose(tag)}>
                        {isLongTag ? `${tag.equipmentName.slice(0, 20)}...` : tag.equipmentName}
                    </Tag>
                );
                return isLongTag ? (
                    <Tooltip title={tag.equipmentName} key={tag.id}>
                        {tagElem}
                    </Tooltip>
                ) : (
                    tagElem
                );
            })
        }
        // display: (index===this.state.currentIndex) ? "block" : "none"

        // 导入
        const propss = {
            name: 'file',
            action: `${baseUrl}${toLead}/location/importExcel`,
            accept: '.xls,.xlsx',
            method: 'post',
            showUploadList: true,
            headers: {
                userId: localStorage.getItem('userId'),
                Token: localStorage.getItem('token'),
            },
            onChange(info) {
                console.log('这是', info);
                if (info.file.status !== 'uploading') {
                    console.log('这是什么', info.file, info.fileList);
                }
                if (info.file.status === 'done') {
                    then.fetch()
                    openSuccessModal('导入成功')
                } else if (info.file.status === 'error') {
                    openModalMessage('error', '错误')
                }
            },
        }
        return (
            <div>
                <div className="banner">
                    <div className="left">
                        {/* 左上角添加删除 */}
                        <div className="leftTop hrcolor">
                            <span>
                                <Icon type="apartment" />
                                <strong>车间模型</strong>
                            </span>
                            <span>
                                <Button icon="plus" onClick={() => this.showDrawer([], 0)} type="primary" size="small" title="新增"></Button>
                                {/* <Button icon="plus-square" onClick={() => this.showModalExtend([], 0)} type="primary" size="small" title="扩展"></Button> */}
                                <Button icon="delete" onClick={() => this.showDeleteConfirm(this.state.list, 0)} type="primary" size="small" title="删除"></Button>
                            </span>
                        </div>
                        {/* 树状控件 */}
                        <div className="leftTree">
                            {/* 是否显示连线         是否显示图标    点击树节点触发  获取当前节点信息                        */}
                            <Tree showLine={true} showIcon={true} onSelect={(selectedKeys, e) => this.onSelectTree(selectedKeys, e)}>{this.renderTreeNodes(this.state.treeData)}</Tree>
                        </div>
                    </div>
                    {/* 内容 */}
                    <div className="right" >
                        <div className="rightTop">
                            {/* 集团 */}
                            <div style={{ display: (this.state.type === 10) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="hdd" />
                                        <strong>{this.state.list.name}</strong>
                                    </div>
                                    {/* <div>
                                <Button icon="save" onClick={()=>this.showDrawer([],0)} type="primary" > 保存 </Button>
                            </div> */}
                                </div>
                                <Form className="search-form" style={{ paddingBottom: 0 }}>
                                    <Row gutter={20}>
                                        <Col span={7}>
                                            <FormItem label="集团编码：">
                                                {getFieldDecorator('groupCode', {
                                                    rules: [{ required: true, message: "请输入集团编码" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入集团编码" disabled maxLength={20} allowClear={true} />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={7}>
                                            <FormItem label="集团名称：">
                                                {getFieldDecorator('groupName', {
                                                    rules: [{ required: true, message: "请输入集团名称" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入集团名称" maxLength={20} allowClear={true} />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6} style={{ marginRight: '10px', display: 'flex' }} className="serarch-btns">
                                            <span style={{ margin: 10 }}>
                                                <a onClick={this.showMoreGroup}>
                                                    更多详情
                                                </a>
                                            </span>
                                        </Col>
                                    </Row>
                                </Form>
                            </div>
                            {/* 工厂 */}
                            <div style={{ display: (this.state.type === 20) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="hdd" />
                                        <strong>{this.state.list.name}</strong>
                                    </div>
                                    {/* <div>
                                <Button icon="save" onClick={()=>this.showDrawer([],0)} type="primary" > 保存 </Button>
                            </div> */}
                                </div>
                                <Form className="search-form" style={{ paddingBottom: 0 }}>
                                    <Row gutter={20}>
                                        <Col span={7}>
                                            <FormItem label="工厂编码：">
                                                {getFieldDecorator('factoryCode', {
                                                    rules: [{ required: true, message: "请输入工厂编码" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入工厂编码" disabled />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={7}>
                                            <FormItem label="工厂名称：">
                                                {getFieldDecorator('factoryName', {
                                                    rules: [{ required: true, message: "请输入工厂名称" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入工厂名称" />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6} style={{ marginRight: '10px', display: 'flex' }} className="serarch-btns">
                                            <span style={{ margin: 10 }}>
                                                <a onClick={this.showMoreFactory}>
                                                    更多详情
                                                </a>
                                            </span>
                                        </Col>
                                    </Row>
                                </Form>
                            </div>
                            {/* 车间 */}
                            <div style={{ display: (this.state.type === 30) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="hdd" />
                                        <strong>{this.state.list.name}</strong>
                                    </div>
                                    {/* <div>
                                <Button icon="save" onClick={()=>this.showDrawer([],0)} type="primary" > 保存 </Button>
                            </div> */}
                                </div>
                                <Form className="search-form" style={{ paddingBottom: 0 }}>
                                    <Row gutter={20}>
                                        <Col span={7}>
                                            <FormItem label="车间编码：">
                                                {getFieldDecorator('workshopCode', {
                                                    rules: [{ required: true, message: "请输入车间编码" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入车间编码" disabled />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={7}>
                                            <FormItem label="车间名称：">
                                                {getFieldDecorator('workshopName', {
                                                    rules: [{ required: true, message: "请输入车间名称" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入车间名称" />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6} style={{ marginRight: '10px', display: 'flex' }} className="serarch-btns">
                                            <span style={{ margin: 10 }}>
                                                <a onClick={this.showMoreWorkShop}>
                                                    更多详情
                                                </a>
                                            </span>
                                        </Col>
                                    </Row>
                                </Form>
                            </div>
                            {/* 总装线 */}
                            <div style={{ display: (this.state.type === 40) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="hdd" />
                                        <strong>{this.state.list.name}</strong>
                                    </div>
                                    {/* <div>
                                <Button icon="save" onClick={()=>this.showDrawer([],0)} type="primary" > 保存 </Button>
                            </div> */}
                                </div>
                                <Form className="search-form" style={{ paddingBottom: 0 }}>
                                    <Row gutter={20}>
                                        <Col span={7}>
                                            <FormItem label="产线编码：">
                                                {getFieldDecorator('productionLineCode', {
                                                    rules: [{ required: true, message: "请输入产线编码" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入产线编码" disabled />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={7}>
                                            <FormItem label="产线名称：">
                                                {getFieldDecorator('productionLineName', {
                                                    rules: [{ required: true, message: "请输入产线名称" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入产线名称" />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6} style={{ marginRight: '10px', display: 'flex' }} className="serarch-btns">
                                            <span style={{ margin: 10 }}>
                                                <a onClick={this.showMoreProductionLine}>
                                                    更多详情
                                                </a>
                                            </span>
                                        </Col>
                                    </Row>
                                </Form>
                            </div>
                            {/* 工位 */}
                            <div style={{ display: (this.state.type === 50) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="hdd" />
                                        <strong>{this.state.list.name}</strong>
                                    </div>
                                    {/* <div>
                                <Button icon="save" onClick={()=>this.showDrawer([],0)} type="primary" > 保存 </Button>
                            </div> */}
                                </div>
                                <Form className="search-form" style={{ paddingBottom: 0 }}>
                                    <Row gutter={20}>
                                        <Col span={7}>
                                            <FormItem label="工位编码：">
                                                {getFieldDecorator('stationCode', {
                                                    rules: [{ required: true, message: "请输入工位编码" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入工位编码" disabled />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={7}>
                                            <FormItem label="工位名称：">
                                                {getFieldDecorator('stationName', {
                                                    rules: [{ required: true, message: "请输入工位名称" }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入工位名称" />,
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6} style={{ marginRight: '10px', display: 'flex' }} className="serarch-btns">
                                            <span style={{ margin: 10 }}>
                                                <a onClick={this.showMoreStation}>
                                                    更多详情
                                                </a>
                                            </span>
                                        </Col>
                                    </Row>
                                </Form>
                            </div>
                        </div>

                        {/* 下级信息 */}
                        <div className="rightCenter">
                            {/* 下级信息工厂 */}
                            <div style={{ display: (this.state.type === 10) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="credit-card" />
                                        <strong>下级信息工厂</strong>
                                    </div>
                                    <div>
                                        <CreateButton icon='plus' style={{ marginLeft: 10 }} key={1} onClick={() => this.showDrawerChild([], 0)} />
                                        <DownLoadButton icon='download' style={{ marginLeft: 10 }} key={2} onClick={this.derive} />
                                        <Upload {...propss} key={6}>
                                            <UploadButton icon='upload' style={{ marginLeft: 10 }} />
                                        </Upload>
                                        {/* <Button icon="plus" onClick={() => this.showDrawerChild([], 0)} type="primary" > 新增 </Button>
                                        <Button key={4} onClick={this.derive} type="primary" icon='download' style={{ margin: '0 5px' }}>导出模板</Button>
                                        <Upload {...propss} key={6}>
                                            <Button type="primary">
                                                <Icon type="upload" /> 导入
                                            </Button>
                                        </Upload> */}
                                    </div>
                                </div>
                                <div className="rightCenterBody" style={{ display: 'flex', flexWrap: 'wrap' }}>
                                    {this.state.listCard.map((e, i) => {
                                        return (
                                            <Card size="small" title={e.name ? e.name : ''} style={{ display: 'flex', width: '33%' }} key={i} extra={<a><Icon type="delete" onClick={() => this.showDeleteConfirm(e, 1)} /></a>}>
                                                <p>编码 : {e.code}</p>
                                            </Card>
                                        )
                                    })}

                                </div>
                            </div>
                            {/* 下级信息车间 */}
                            <div style={{ display: (this.state.type === 20) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="credit-card" />
                                        <strong>下级信息车间</strong>
                                    </div>
                                    <div>
                                        <CreateButton icon='plus' style={{ marginLeft: 10 }} key={1} onClick={() => this.showDrawerChildWorkShop([], 0)} />
                                        <DownLoadButton icon='download' style={{ marginLeft: 10 }} key={2} onClick={this.derive} />
                                        <Upload {...propss} key={6}>
                                            <UploadButton icon='upload' style={{ marginLeft: 10 }} />
                                        </Upload>

                                        {/* <Button icon="plus" onClick={() => this.showDrawerChildWorkShop([], 0)} type="primary" > 新增 </Button>
                                        <Button key={4} onClick={this.derive} type="primary" icon='download' style={{ margin: '0 5px' }}>导出模板</Button>
                                        <Upload {...propss} key={6}>
                                            <Button type="primary">
                                                <Icon type="upload" /> 导入
                                            </Button>
                                        </Upload> */}
                                    </div>
                                </div>
                                <div className="rightCenterBody" style={{ flexWrap: 'wrap', display: 'flex' }}>
                                    {this.state.listCard.map((e, i) => {
                                        return (
                                            <Card size="small" title={e.name} style={{ display: 'flex', width: '33%' }} key={i} extra={<a><Icon type="delete" onClick={() => this.showDeleteConfirm(e, 1)} /></a>} >
                                                <p>编码 : {e.code}</p>
                                            </Card>
                                        )
                                    })}
                                </div>
                            </div>
                            {/* 下级工作中心*/}
                            <div style={{ display: (this.state.type === 30) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="credit-card" />
                                        <strong>下级工作中心</strong>
                                    </div>
                                    <div>
                                        <CreateButton icon='plus' style={{ marginLeft: 10 }} key={1} onClick={() => this.showDrawerChildProductionLine([], 0)} />
                                        <DownLoadButton icon='download' style={{ marginLeft: 10 }} key={2} onClick={this.derive} />
                                        <Upload {...propss} key={6}>
                                            <UploadButton icon='upload' style={{ marginLeft: 10 }} />
                                        </Upload>
                                        {/* <Button icon="plus" onClick={() => this.showDrawerChildProductionLine([], 0)} type="primary" > 新增 </Button>
                                        <Button key={4} onClick={this.derive} type="primary" icon='download' style={{ margin: '0 5px' }}>导出模板</Button>
                                        <Upload {...propss} key={6}>
                                            <Button type="primary">
                                                <Icon type="upload" /> 导入
                                            </Button>
                                        </Upload> */}
                                    </div>
                                </div>
                                <div className="rightCenterBody" style={{ flexWrap: 'wrap', display: 'flex' }}>
                                    {this.state.listCard.map((e, i) => {
                                        return (
                                            <Card size="small" title={e.name} style={{ display: 'flex', width: '33%' }} key={i} extra={<a><Icon type="delete" onClick={() => this.showDeleteConfirm(e, 1)} /></a>} >
                                                <p>编码 : {e.code}</p>
                                            </Card>
                                        )
                                    })}
                                </div>
                            </div>
                            {/*下级信息工位  */}
                            <div style={{ display: (this.state.type === 40) ? "block" : "none" }}>
                                <div className="rightTopTitle hrcolor">
                                    <div>
                                        <Icon type="credit-card" />
                                        <strong>下级信息工位</strong>
                                    </div>
                                    <div>
                                        <CreateButton icon='plus' style={{ marginLeft: 10 }} key={1} onClick={() => this.showDrawerChildStation([], 0)} />
                                        <DownLoadButton icon='download' style={{ marginLeft: 10 }} key={2} onClick={this.derive} />
                                        <Upload {...propss} key={6}>
                                            <UploadButton icon='upload' style={{ marginLeft: 10 }} />
                                        </Upload>
                                        {/* <Button icon="plus" onClick={() => this.showDrawerChildStation([], 0)} type="primary" > 新增 </Button>
                                        <Button key={4} onClick={this.derive} type="primary" icon='download' style={{ margin: '0 5px' }}>导出模板</Button>
                                        <Upload {...propss} key={6}>
                                            <Button type="primary">
                                                <Icon type="upload" /> 导入
                                            </Button>
                                        </Upload> */}
                                    </div>
                                </div>
                                <div className="rightCenterBody" style={{ flexWrap: 'wrap', display: 'flex' }}>
                                    {this.state.listCard.map((e, i) => {
                                        return (
                                            <Card size="small" title={e.name} style={{ display: 'flex', width: '33%' }} key={i} extra={<a><Icon type="delete" onClick={() => this.showDeleteConfirm(e, 1)} /></a>} >
                                                <p>编码 : {e.code}</p>
                                            </Card>
                                        )
                                    })}
                                </div>
                            </div>
                        </div>
                        {/* 信息设备 */}
                        <div className="rightBottom" style={{ display: (this.state.type === 50) ? "block" : "none" }}>
                            <div className="rightTopTitle hrcolor" >
                                <div>
                                    <Icon type="credit-card" />
                                    <strong>设备信息</strong>
                                </div>
                                <div>
                                    <CreateButton icon='plus' style={{ marginLeft: 10 }} key={1} onClick={() => this.showDrawerMachine([], 0)} />
                                    <DownLoadButton icon='download' style={{ marginLeft: 10 }} key={2} onClick={this.derive} />
                                    <Upload {...propss} key={6}>
                                        <UploadButton icon='upload' style={{ marginLeft: 10 }} />
                                    </Upload>
                                    {/* <Button icon="plus" onClick={() => this.showDrawerMachine([], 0)} type="primary" > 新增 </Button>
                                    <Button key={4} onClick={this.derive} type="primary" icon='download' style={{ margin: '0 5px' }}>导出模板</Button>
                                    <Upload {...propss} key={6}>
                                        <Button type="primary">
                                            <Icon type="upload" /> 导入
                                        </Button>
                                    </Upload> */}
                                </div>
                            </div>
                            <div className="rightCenterBody" style={{ flexWrap: 'wrap', display: 'flex' }}>
                                {this.state.listCard.map((e, i) => {
                                    return (
                                        <Card size="small" title={e.name} style={{ display: 'flex', width: '33%' }} key={i} extra={<a><Icon type="delete" onClick={() => this.showDeleteConfirm(e, 1)} /></a>} >
                                            <p>编码 : {e.code}</p>
                                        </Card>
                                    )
                                })}
                            </div>
                        </div>
                    </div>




                    {/* 新增集团 */}
                    <Drawer
                        title="新增集团"
                        width={620}
                        onClose={this.onClose}
                        visible={this.state.visible}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="集团编码：">
                                        {getFieldDecorator('addGroupCode', {
                                            rules: [{ required: true, message: '请填写集团编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写集团编码" maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="集团名称：">
                                        {getFieldDecorator('addGroupName', {
                                            rules: [{ required: true, message: '请填写集团名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写集团名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="集团地址：">
                                        {getFieldDecorator('groupAdress', {
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写集团地址" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="子集团：">
                                        {getFieldDecorator('childGroupName', {
                                            rules: [{ initialValue: 10 }],
                                        })(
                                            <InputNumber min={1} max={10} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onClose} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOk} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 扩展 */}
                    <Drawer
                        title="扩展字段"
                        width={620}
                        onClose={this.onCloseExtend}
                        visible={this.state.visibleExtend}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Tabs defaultActiveKey="1" onChange={callback}>
                            <TabPane tab="集团扩展" key="1">
                                <Form layout="vertical" className="hrcolor" >
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="编码:">
                                                {getFieldDecorator('Code', {
                                                    rules: [{ required: true, message: '请输入编码' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(<Input placeholder="请输入编码" maxLength={20} allowClear={true} />)}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="类型:">
                                                {getFieldDecorator('Type', {
                                                    rules: [{ required: true, message: '请选择类型' }],
                                                })(
                                                    <Select placeholder="字符类型">
                                                        <Option value="private">Private</Option>
                                                        <Option value="public">Public</Option>
                                                    </Select>,
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="名称(英文):">
                                                {getFieldDecorator('NameEN', {
                                                    rules: [{ required: true, message: '请输入名称(英文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(英文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="名称(中文):">
                                                {getFieldDecorator('NameCN', {
                                                    rules: [{ required: true, message: '请输入名称(中文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(中文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                </Form>
                                <div className="hrcolor">
                                    <Button icon="plus" type="primary" style={{ marginLeft: 490, marginTop: 10, marginBottom: 10 }}> 新增 </Button>
                                </div>
                                <Table dataSource={this.state.dataSourceExtend} columns={columnsExtend} />
                            </TabPane>
                            <TabPane tab="工厂扩展" key="2">
                                <Form layout="vertical" className="hrcolor" >
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="编码:">
                                                {getFieldDecorator('Code', {
                                                    rules: [{ required: true, message: '请输入编码' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(<Input placeholder="请输入编码" maxLength={20} allowClear={true} />)}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="类型:">
                                                {getFieldDecorator('Type', {
                                                    rules: [{ required: true, message: '请选择类型' }],
                                                })(
                                                    <Select placeholder="字符类型">
                                                        <Option value="private">Private</Option>
                                                        <Option value="public">Public</Option>
                                                    </Select>,
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="名称(英文):">
                                                {getFieldDecorator('NameEN', {
                                                    rules: [{ required: true, message: '请输入名称(英文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(英文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="名称(中文):">
                                                {getFieldDecorator('NameCN', {
                                                    rules: [{ required: true, message: '请输入名称(中文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(中文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                </Form>
                                <div className="hrcolor">
                                    <Button icon="plus" type="primary" style={{ marginLeft: 490, marginTop: 10, marginBottom: 10 }}> 新增 </Button>
                                </div>
                                <Table dataSource={this.state.dataSourceExtend} columns={columnsExtend} />
                            </TabPane>
                            <TabPane tab="车间扩展" key="3">
                                <Form layout="vertical" className="hrcolor" >
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="编码:">
                                                {getFieldDecorator('Code', {
                                                    rules: [{ required: true, message: '请输入编码' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(<Input placeholder="请输入编码" maxLength={20} allowClear={true} />)}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="类型:">
                                                {getFieldDecorator('Type', {
                                                    rules: [{ required: true, message: '请选择类型' }],
                                                })(
                                                    <Select placeholder="字符类型">
                                                        <Option value="private">Private</Option>
                                                        <Option value="public">Public</Option>
                                                    </Select>,
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="名称(英文):">
                                                {getFieldDecorator('NameEN', {
                                                    rules: [{ required: true, message: '请输入名称(英文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(英文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="名称(中文):">
                                                {getFieldDecorator('NameCN', {
                                                    rules: [{ required: true, message: '请输入名称(中文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(中文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                </Form>
                                <div className="hrcolor">
                                    <Button icon="plus" type="primary" style={{ marginLeft: 490, marginTop: 10, marginBottom: 10 }}> 新增 </Button>
                                </div>
                                <Table dataSource={this.state.dataSourceExtend} columns={columnsExtend} />
                            </TabPane>

                            <TabPane tab="产线扩展" key="4">
                                <Form layout="vertical" className="hrcolor" >
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="编码:">
                                                {getFieldDecorator('Code', {
                                                    rules: [{ required: true, message: '请输入编码' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(<Input placeholder="请输入编码" maxLength={20} allowClear={true} />)}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="类型:">
                                                {getFieldDecorator('Type', {
                                                    rules: [{ required: true, message: '请选择类型' }],
                                                })(
                                                    <Select placeholder="字符类型">
                                                        <Option value="private">Private</Option>
                                                        <Option value="public">Public</Option>
                                                    </Select>,
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row gutter={26}>
                                        <Col span={12}>
                                            <FormItem label="名称(英文):">
                                                {getFieldDecorator('NameEN', {
                                                    rules: [{ required: true, message: '请输入名称(英文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(英文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={12}>
                                            <FormItem label="名称(中文):">
                                                {getFieldDecorator('NameCN', {
                                                    rules: [{ required: true, message: '请输入名称(中文)' }],
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入名称(中文)" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                </Form>
                                <div className="hrcolor">
                                    <Button icon="plus" type="primary" style={{ marginLeft: 490, marginTop: 10, marginBottom: 10 }}> 新增 </Button>
                                </div>
                                <Table dataSource={this.state.dataSourceExtend} columns={columnsExtend} />
                            </TabPane>
                        </Tabs>

                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseExtend} style={{ marginRight: 8 }}>
                                关闭
                            </Button>
                        </div>
                    </Drawer>

                    {/* 更多详情 ---- 集团 */}
                    <Drawer
                        title="更多详情"
                        width={620}
                        onClose={this.onCloseChange}
                        visible={this.state.visibleMoreGroup}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="集团编码：">
                                        {getFieldDecorator('groupCodeMore', {
                                            rules: [{ required: true, message: '请填写集团编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写集团编码" disabled maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="集团名称：">
                                        {getFieldDecorator('groupNameMore', {
                                            rules: [{ required: true, message: '请填写集团名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写集团名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="集团地址：">
                                        {getFieldDecorator('groupAdressMore', {
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写集团地址" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="子集团：">
                                        {getFieldDecorator('childGroupNameMore', {
                                            rules: [{ initialValue: 10 }],
                                        })(
                                            <InputNumber min={1} max={10} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChange} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChange} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 更多详情 ----工厂 */}
                    <Drawer
                        title="更多详情"
                        width={620}
                        onClose={this.onCloseChangeFactory}
                        visible={this.state.visibleMoreFactory}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="工厂编码：">
                                        {getFieldDecorator('factoryCodeMore', {
                                            rules: [{ required: true, message: '请填写工厂编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写工厂编码" disabled maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="工厂名称：">
                                        {getFieldDecorator('factoryNameMore', {
                                            rules: [{ required: true, message: '请填写工厂名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写工厂名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChangeFactory} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChangeFactory} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 更多详情 ----车间 */}
                    <Drawer
                        title="更多详情"
                        width={620}
                        onClose={this.onCloseChangeWorkShop}
                        visible={this.state.visibleMoreWorkShop}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="车间编码：">
                                        {getFieldDecorator('workshopCodeMore', {
                                            rules: [{ required: true, message: '请填写车间编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写车间编码" disabled maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="车间名称：">
                                        {getFieldDecorator('workshopNameMore', {
                                            rules: [{ required: true, message: '请填写车间名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写车间名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChangeWorkShop} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChangeWorkShop} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 更多详情 ----产线 */}
                    <Drawer
                        title="更多详情"
                        width={620}
                        onClose={this.onCloseChangeProductionLine}
                        visible={this.state.visibleMoreProductionLine}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="产线编码：">
                                        {getFieldDecorator('produtionLineCodeMore', {
                                            rules: [{ required: true, message: '请填写产线编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写产线编码" disabled maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="产线名称：">
                                        {getFieldDecorator('produtionLineNameMore', {
                                            rules: [{ required: true, message: '请填写产线名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写产线名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChangeProductionLine} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChangeProductionLine} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 更多详情 ----工位 */}
                    <Drawer
                        title="更多详情"
                        width={620}
                        onClose={this.onCloseChangeStation}
                        visible={this.state.visibleMoreStation}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={12}>
                                    <FormItem label="工位编码：">
                                        {getFieldDecorator('stationCodeMore', {
                                            rules: [{ required: true, message: '请填写工位编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写工位编码" disabled maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem label="工位名称：">
                                        {getFieldDecorator('stationNameMore', {
                                            rules: [{ required: true, message: '请填写工位名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写工位名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChangeStation} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChangeStation} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>

                    {/* 新增工厂 */}
                    <Drawer
                        title="新增工厂"
                        width={420}
                        onClose={this.onCloseChild}
                        visible={this.state.visibleChild}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="上级节点：">
                                        <span>{this.state.list.name}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="工厂编码：">
                                        {getFieldDecorator('factoryCodeAdd', {
                                            rules: [{ required: true, message: '请填写工厂编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写工厂编码" maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="工厂名称：">
                                        {getFieldDecorator('factoryNameAdd', {
                                            rules: [{ required: true, message: '请填写工厂名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写工厂名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChild} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChild} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 新增车间 */}
                    <Drawer
                        title="新增车间"
                        width={420}
                        onClose={this.onCloseChildWorkShop}
                        visible={this.state.visibleChildWorkShop}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="上级节点：">
                                        <span>{this.state.list.name}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="车间编码：">
                                        {getFieldDecorator('workshopCodeAdd', {
                                            rules: [{ required: true, message: '请填写车间编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写车间编码" maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="车间名称：">
                                        {getFieldDecorator('workshopNameAdd', {
                                            rules: [{ required: true, message: '请填写车间名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写车间名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChildWorkShop} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChildWorkShop} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 新增产线 */}
                    <Drawer
                        title="新增产线"
                        width={420}
                        onClose={this.onCloseChildProductionLine}
                        visible={this.state.visibleChildProductionLine}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="上级节点：">
                                        <span>{this.state.list.name}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="产线编码：">
                                        {getFieldDecorator('productionLineCodeAdd', {
                                            rules: [{ required: true, message: '请填写产线编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写产线编码" maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="产线名称：">
                                        {getFieldDecorator('productionLineNameAdd', {
                                            rules: [{ required: true, message: '请填写产线名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写产线名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChildProductionLine} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChildProductionLine} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>
                    {/* 新增工位 */}
                    <Drawer
                        title="新增产线"
                        width={420}
                        onClose={this.onCloseChildStation}
                        visible={this.state.visibleChildStation}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Form layout="vertical">
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="上级节点：">
                                        <span>{this.state.list.name}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="工位编码：">
                                        {getFieldDecorator('stationCodeAdd', {
                                            rules: [{ required: true, message: '请填写工位编码' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(<Input placeholder="请填写工位编码" maxLength={20} allowClear={true} />)}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row gutter={26}>
                                <Col span={22}>
                                    <FormItem label="工位名称：">
                                        {getFieldDecorator('stationNameAdd', {
                                            rules: [{ required: true, message: '请填写工位名称' }],
                                            getValueFromEvent: (event) => {
                                                return event.target.value.replace(/\s+/g, "")
                                            },
                                        })(
                                            <Input placeholder="请填写工位名称" maxLength={20} allowClear={true} />
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseChildStation} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkChildStation} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>

                    {/* 新增设备 */}
                    <Drawer
                        width={620}
                        onClose={this.onCloseMachine}
                        visible={this.state.visibleMachine}
                        bodyStyle={{ paddingBottom: 80 }}
                    >
                        <Tabs defaultActiveKey="1" onChange={this.onChange}>
                            {/* <TabPane tab="添加设备" key="1">
                            <Form layout="vertical" >
                                <Row gutter={26}>
                                    <Col span={22}>
                                        <FormItem label="设备编码:">
                                            {getFieldDecorator('equipmentCodeAdd', {
                                                rules: [{ required: true, message: '请输入设备编码' }],
                                            })(<Input placeholder="请输入设备编码" />)}
                                        </FormItem>
                                    </Col>
                                </Row>
                                <Row gutter={26}>
                                    <Col span={22}>
                                        <FormItem label="设备名称:">
                                            {getFieldDecorator('equipmentNameAdd', {
                                                rules: [{ required: true, message: '请输入设备名称' }],
                                            })(
                                                <Input placeholder="请输入设备名称" />
                                            )}
                                        </FormItem>
                                    </Col>
                                </Row>
                            </Form>
                        </TabPane> */}
                            <TabPane tab="选择设备" key="1">
                                <div>
                                    <Tags />
                                </div>
                                <Form layout="vertical" className="hrcolor" >
                                    <Row gutter={26}>
                                        <Col span={10}>
                                            <FormItem label="设备编码:">
                                                {getFieldDecorator('equipmentCodeSearch', {
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(<Input placeholder="请输入设备编码" />)}
                                            </FormItem>
                                        </Col>
                                        <Col span={10}>
                                            <FormItem label="设备名称:">
                                                {getFieldDecorator('equipmentNameSearch', {
                                                    getValueFromEvent: (event) => {
                                                        return event.target.value.replace(/\s+/g, "")
                                                    },
                                                })(
                                                    <Input placeholder="请输入设备名称" maxLength={20} allowClear={true} />
                                                )}
                                            </FormItem>
                                        </Col>
                                        {/* </Row>
                                <Row gutter={26}> */}
                                        {/* <Col span={12}>
                                        <FormItem label="设备类型:">
                                            {getFieldDecorator('equipmentTypeNameSearch')(
                                                <Select placeholder="设备类型">
                                                    <Option value="private">Private</Option>
                                                    <Option value="public">Public</Option>
                                                </Select>,
                                            )}
                                        </FormItem>
                                    </Col> */}
                                        <Col span={2}>
                                            <Button icon="search" type="primary" onClick={() => this.handleSearch()} style={{ marginTop: 29, marginLeft: '-17px' }}> 查询 </Button>
                                        </Col>
                                    </Row>
                                </Form>
                                <Table dataSource={this.state.dataSourceEquipmentType} rowKey={(record) => record.id} columns={columnsEquipmentType} rowSelection={this.state.rowSelection} loading={this.state.loading} />
                            </TabPane>
                        </Tabs>
                        <div
                            style={{
                                position: 'absolute',
                                right: 0,
                                bottom: 0,
                                width: '100%',
                                borderTop: '1px solid #e9e9e9',
                                padding: '10px 16px',
                                background: '#fff',
                                textAlign: 'right',
                            }}
                        >
                            <Button onClick={this.onCloseMachine} style={{ marginRight: 8 }}>
                                取消
                            </Button>
                            <Button onClick={this.onOkMachine} type="primary">
                                保存
                            </Button>
                        </div>
                    </Drawer>

                </div>
            </div>
        )
    }
}
export default Form.create()(App);